<cfmodule template="../../tag/layout.cfm" bodyIsEasyUILayout="false">
<script type="text/javascript" charset="utf-8" src="ueditor/ueditor.config.js"></script>
<script type="text/javascript" charset="utf-8" src="ueditor/ueditor.all.min.js"> </script>
<script type="text/javascript" charset="utf-8" src="ueditor/lang/zh-cn/zh-cn.js"></script>
<script type="text/javascript" charset="utf-8" src="assets/js/fwExtEasyUIvalidate.js"></script>
<cfscript>
	if( structKeyExists(rc, "id")  && rc.id > 0 ){
		id = rc.id;
	}else{
		id = 0;
	}

	if( structKeyExists(rc, "categorytypeid")  && rc.categorytypeid > 0 ){
		categorytypeid = rc.categorytypeid;
	}else{
		categorytypeid = 0;
	}
</cfscript>
<form method="post" class="form">
	<div id="tabs" class="easyui-tabs">
		<div title="类别基本信息" style="padding:10px">

		    <table class="table" width="100%">
		      <tbody>
		        <tr>
		          <th>编号</th>
		          <td><input name="id" readonly /></td>
		          <th>所属栏目</th>
		          <td><input id="categoryName" name="categoryName" readonly="readonly"><input name="categoryid" type="hidden" value="<cfoutput>#categoryid#</cfoutput>"></td>
		        </tr>
		        <tr>
		          <th>信息标题</th>
		          <td><input id="subject" name="subject" class="easyui-validatebox" data-options="required:true"/></td>
		          <th>作者</th>
		          <td><input name="author"/></td>
		        </tr>
		         <tr>
		          <th>来源</th>
		          <td><input name="source"  /></td>
		          <th>图片</th>
		          <td>
		          	<select class="selectFiles"><option>选择文件</option></select>
		          	<a href="#" class="easyui-linkbutton uploader" data-options="iconCls:'icon-add'">选择文件</a>
		          	<input name="pic" class="selectFilesValue" type="hidden" />
		          </td>
		        </tr>
		        <tr>
		          <th>关键词</th>
		          <td colspan="3">
		          	<input name="keywords" style="width:550px;">
		          </td>
		        </tr>
		        <tr>
		          <th>简介</th>
		          <td colspan="3">
		          	<textarea id="brief" name="brief" style="width:560px"></textarea>
		          	<input type="button" mode="0" class="editor" onclick="EditorRender('brief',$(this))" value="切换至编辑器">
		          </td>
		        </tr>
		        <tr>
		          <th>信息属性</th>
		          <td colspan="3">
		          	<input name="ispublish" type="checkbox" value="1" /> 是否发布
		          	<input name="iscommend" type="checkbox" value="1" /> 是否推荐
		          	<input name="iscomment" type="checkbox" value="1" /> 是否评论
		          	<input name="isscroll" type="checkbox" value="1" /> 是否滚动
		          </td>
		        </tr>
		        <tr>
		          <th>信息内容</th>
		          <td colspan="3">
		          	<textarea id="content" name="content" style="width:560px;height:200px;" class="easyui-validatebox" data-options="required:true"></textarea>
		          	<input type="button" mode="0" class="editor" onclick="EditorRender('content',$(this))" value="切换至编辑器">
		          </td>
		        </tr>
		        <tr>
		          <th>信息排序</th>
		          <td><input name="seq" class="easyui-numberspinner"  value="0"  style="width:50px;" /></td>
		          <th>点击次数</th>
		          <td><input name="hits" class="easyui-numberspinner" value="0"  style="width:50px;" /></td>
		        </tr>
		      </tbody>
		    </table>

		  </div>

		  <div title="扩展字段表单" id="extTab">
		  	 <table class="table" width="100%">
		      <tbody id="extForm"></tbody>
		     </table>
		  </div>
	</div>

	<input type="hidden" name="extFields" id="extFields">
</form>
</cfmodule>
<script type="text/javascript">
	//选择文件部分的函数操作，需要将自身对象及ids列表作为参数进行传递
	/*
	function uploaderFun(){
		var btn = $(this);
		var ids = "";
		if($(this).next().val().trim().length!=0){
			ids = "&ids=" + $(this).next().val();
		}

		var dialog = parent.fw.modalDialog({
	        title: '选择文件',
	        url: '?action=uploader.uploader' + ids,
	        width:700,
	        height:500,
	        buttons: [
	        {
	            text: '确认选择',
	            handler: function() {
	               dialog.find('iframe').get(0).contentWindow.submitForm(dialog, btn);
	            }
	        },
	        {
	            text: '清除文件',
	            handler: function() {
	               dialog.find('iframe').get(0).contentWindow.clearSelectedFiles(dialog,btn);
	            }
	        },
	        {
	            text: '关闭窗口',
	            handler: function() {
	               dialog.find('iframe').get(0).contentWindow.closeDialog(dialog);
	            }
	        }]
	    });
	}
	*/
	var closeDialog = function($dialog) {
		$dialog.dialog('destroy');
	}


	var submitNow = function($dialog, $grid, $pjq) {
		var url;
		if ($(':input[name="id"]').val().length > 0) {
			url = '?action=article.update'; //更新操作
		} else {
			url = '?action=article.save';	//新增操作
		}

		//alert($.toJSON(fw.serializeObject($('form'),$('#extFields').val() ) ));

		$.post(url, fw.serializeObject($('form'),$('#extFields').val() ), function(result) {
			if (result) {
				$grid.datagrid('reload');
				$dialog.dialog('destroy');
			}
		}, 'json');
	};

	var submitForm = function($dialog, $grid, $pjq) {
		//遍历所有编辑器，将编辑器模式切换到textarea模式，目的是为了必填的编辑器字段验证数据是否有输入
		$('.editor').each(function(){
			if($(this).attr('mode') == 1){
				$(this).click();
			}
		});
		//首先判断subject及content必填字段是否为空，如果不为空，则去判断扩展字段中的数据字段是否有验证字段，并且不为空
		if( $("#subject").val().trim().length !=0 && $("#content").val().trim().length != 0){
			$('.easyui-validatebox').each(function(){
				if($(this).attr('id') !='subject' && $(this).attr('id') !='content' &&  $(this).attr('data-options').toLowerCase().indexOf("required:true") >= 0){
					var tab = $("#tabs").tabs("select", 1);
					//如果扩展字段中有一个需要验证的字段，且为空，则切到tabs的扩展选项卡中，并中断
					return false;
				}

			});
		}else{
			var tab = $("#tabs").tabs("select", 0);
		}

		if ($('form').form('validate')) {
			submitNow($dialog, $grid, $pjq);
		}
	};

	//获取扩展字段的字段名清单，为了给fw.serializeObject进行参数传递
	function getExtFiledsList(arrFields){
		var extFields = new Array();
		for( var i = 0;i<arrFields.length;i++ ){
			arrSingleField = arrFields[i].split(':');
			eName = arrSingleField[0];
			extFields.push(eName);
		}
		return extFields.toString();
	}

	//动态表单的html内容生成器
	function getHtml(arrFields){
		html="";
			for( var i = 0;i<arrFields.length;i++ ){
				//单个字段
				arrSingleField = arrFields[i].split(':');
				//英文字段名称
				eName = arrSingleField[0];
				//中文字段说明
				cName = arrSingleField[1];
				//必选验证
				fRequire = arrSingleField[2];
				//验证类型
				fCheckType = arrSingleField[3];
				arrCheckType = new Array('','integer','email','url','phone','mobile','phoneOrMobile','zip','currency','english','chinese','qq');
				fCheckString = arrCheckType[fCheckType];
				//字段类型，数字型
				fType = parseInt(arrSingleField[4].split('+')[0]);
				//字段的值
				fValue = arrSingleField[4].split('+')[1];

				//验证字符串组成部分
				if(fRequire == 1){
					fRequireStrings = "required:true";
				}else{
					fRequireStrings = "required:false";
				}

				fCheckTypeStrings = "";
				if(fCheckType!=0){
					fCheckTypeStrings = "validType:'"+fCheckString+"'";
				}

				if(fCheckTypeStrings.trim().length == 0){
					checkString = 'class="easyui-validatebox" data-options="'+ fRequireStrings +'"';
				}else{
					checkString = 'class="easyui-validatebox" data-options="'+ fRequireStrings + "," + fCheckTypeStrings +'"';
				}

				//字段窗体对象字符串组成部分
				html += "<tr>";
				switch(fType)
				{
				case 1://文本框
					html += fw.formatString("<th>{1}</th><td><input type='text' name='{0}' {2}></td>",eName,cName,checkString);
				  break;
				case 2://编辑框
					html += fw.formatString("<th>{1}</th><td><textarea style='width:560px' name='{0}' {2}></textarea></td>",eName,cName,checkString);
				  break;
				case 3://下拉框
					optionHtml = "<option value=''>请选择</option>";
					$.each(fValue.split('|'), function(){
					    optionHtml += fw.formatString("<option>{0}</option>", this.trim());
					});
					html += fw.formatString("<th>{1}</th><td><select name='{0}' {3}>{2}</select></td>",eName,cName,optionHtml,checkString);
				  break;
				case 4://复选框
					checkboxHtml = "";
					$.each(fValue.split('|'), function(){
					    checkboxHtml += fw.formatString("<input class='extCheckbox' type='checkbox' name='{0}' value='"+this.trim()+"'> {1}",eName,this.trim());
					});
					html += fw.formatString("<th>{0}</th><td>{1}</td>",cName,checkboxHtml);
				  break;
				case 5://选择文件
					html += fw.formatString("<th>{1}</th><td><select class='selectFiles'><option>选择文件</option></select> <a href='#' class='easyui-linkbutton uploader' data-options=\"iconCls:'icon-add'\">选择文件</a> <input name='{0}' class='selectFilesValue' type='hidden' {2}/></td>",eName,cName,checkString);
				  break;
				case 6://选择日期
					html += fw.formatString("<th>{1}</th><td><input class='easyui-datebox' name='{0}' {2}></td>",eName,cName,checkString);
				  break;
				case 7://富文本框
					html += fw.formatString("<th>{3}</th><td><textarea id='{0}' style='width:560px;height:200px;' name='{1}' {4}></textarea><br/><input type='button' mode='0' class='editor' onclick=\"EditorRender('{2}',$(this))\" value='切换至编辑器'></td>",eName,eName,eName,cName,checkString);
				  break;
				default:

				}
				html +="</tr>";

			}
		return html;

	}


	$(function(){
		//获取当前的信息分类
		$.ajax({
		    type: "POST",
		    url: "?action=category.get",
		    data: {
		        id:<cfoutput>#categoryid#</cfoutput>
		    }
		}).done(function(result) {
			$("#categoryName").val(result.text);
			//扩展字段操作部分
			//如果formobjectlist未定义或为空，则扩展字段选项卡禁用
			if( typeof(result.formobjectlist) ==  'undefined' ||  result.formobjectlist.trim().length == 0){
				$('#tabs').tabs('disableTab', 1);
			}else{
				$('#extForm').html(getHtml(result.formobjectlist.split(',')));
				//重新渲染对象，以便验证操作生效
				$.parser.parse($('#extForm'));
				$('#extFields').val(getExtFiledsList(result.formobjectlist.split(',')));

				//绑定上传按钮功能
				$(".uploader").on('click',uploaderFun);
			}

		}, 'json');

		//加载数据，初始进度条
		parent.$.messager.progress({
			text : '数据加载中....'
		});

		//获取信息基本信息，在编辑模式下，需要去单独获取所有的选择文件类型的内容，将值放置到select里
		$.ajax({
		    type: "POST",
		    url: "?action=article.get&categorytypeid=<cfoutput>#categorytypeid#</cfoutput>",
		    data: {
		        id:<cfoutput>#id#</cfoutput>
		    }
		}).done(function(result) {
			$('form').form('load', result);

			if ($(':input[name="id"]').val().length > 0) {
				var id = $(':input[name="id"]').val();
				//更新操作时，处理所有文件选择
				//先对所有uploader的class对象进行遍历
				$( ".uploader" ).each(function() {
					//如果该文件选择器有值，则进行异步数据获取
					if($(this).next('.selectFilesValue').val().trim().length!=0){
						var ids =  $(this).next('.selectFilesValue').val();
						var selectObj = $(this).prev('.selectFiles');
						var options = "<option>选择文件</option>";
						$.ajax({
							type: "POST",
						    url: "?action=uploader.gets",
						    data:{ids:ids}
						}).done(function(result){
							//对返回结果进行遍历，重组option选项，并将结果放置到相应的selectOption对象中去
							$(result).each(function(){
								options +="<option>" + this.clientname + "</option>";
							})
							selectObj.html(options);
						})
					}
				});

				//更新操作时，对扩展字段的checkbox对象进行获值操作
				var arrCheckboxObj = [];
				$( ".extCheckbox" ).each(function() {
					arrCheckboxObj.push($(this).attr('name'));
				});

				var checkboxObj = $.unique(arrCheckboxObj);
				//对唯一的字段名称数组进行遍历
				$(checkboxObj).each(function(index,element){
					$.ajax({
						type: "POST",
					    url: "?action=article.getextendcheckbox",
					    data:{id:id,name:element}
					}).done(function(result){
						//如果扩展字段中能够找到相应的元素，则进行checkbox打钩选择操作
						$('input[class="extCheckbox"][name="'+element+'"]').each(function(){
							if(	$.inArray( $(this).val(), result[0].cellvalue.split(',')) != -1 ){
								$(this).prop("checked",true);
							}
						});
					})

				});

			}

			parent.$.messager.progress('close');
		}, 'json');

	})
</script>
